<template>
  <component :is="tag||$parent.itemTag" class="cell-item" :style="styles">
    <slot></slot>
  </component>
</template>

<script>
  export default {
    componentName: 'ECellItem',
    props: {
      tag: {
        type: [String, Object]
      }
    },
    computed: {
      styles () {
        return this.$parent.gutter ? {
          'padding-left': this.$parent.gutter / 2 + 'px',
          'padding-right': this.$parent.gutter / 2 + 'px'
        } : {}
      }
    }
  }
</script>
